<!DOCTYPE html>
<html>
	<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>考试中心</title>
    <script src="__JS__/mui.min.js"></script>
    <link href="__CSS__/mui.min.css" rel="stylesheet"/>
    <link href="__CSS__/base.css" rel="stylesheet" />
    <link href="__CSS__/index.css" rel="stylesheet" />
	</head>
	<body>
		<header class="app_header">
			<div class="back"></div>
			报名考试
		</header>
			<style>
			.mui-card .mui-control-content {
				padding: 10px;
			}
			
			.mui-control-content {
				height: 150px;
			}
		</style>
	</head>

	<body>
		<section>
			<div class="area-center">
				<div class="exam-bar active" id="join">可报名</div>
				<div class="exam-bar" id="joined">已报名</div>
			</div>
			
			<!--
            	作者：ikeke520@126.com
            	时间：2018-06-22
            	描述：可报名考试列表
            -->
            <div class="join">
            <volist name="join_list" id="vo">
           
            <div class="examList">
            	<div class="exam-info-text">{$vo.type}{$vo.content}</div>
            	<div class="exam-info">
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">考试日期</div><span class="c-left c-c">{$vo.examDate|strtotime|date="Y-m-d",###}</span></div>
            		</div>
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">出发日期</div><span class="c-left c-c">{$vo.goDate|strtotime|date="Y-m-d",###}</span></div>
            		</div>
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">报名截止</div><span class="c-left c-c">{$vo.enterEndDate|strtotime|date="Y-m-d",###}</span></div>
            		</div>
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">人数上限</div><span class="c-left c-c">{$vo.enterNum}</span></div>
            		</div>
            			<img src="__IMG__/next.png" class="next" id="{$vo.id}"/>
            	</div>
            </div>
           
            </volist>
            </div>
            <div class="joined exam-hidden">
            
             <volist name="joined_list" id="vo">
            	<div class="examList">
            	<div class="exam-info-text">考试信息</div>
            	<div class="exam-info-high">
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">考试日期</div><span class="c-left c-c">{$vo.examDate|strtotime|date="Y-m-d",###}</span></div>
            		</div>
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">报名截止</div><span class="c-left c-c">{$vo.enterEndDate|strtotime|date="Y-m-d",###}</span></div>
            		</div>
            		<div class="exam-content">
            			<div><div class="c-left c-t area-center">人数上限</div><span class="c-left c-c">{$vo.enterNum}</span></div>
            		</div>
            		<div class="exam-content-long">
            			<div><div class="c-left c-t area-center">出发日期</div><span class="c-left-long c-c">{$vo.goDate|strtotime|date="Y-m-d H:i:s",###}</span></div>
            		</div>
            		<div class="exam-content-long">
            			<div><div class="c-left c-t area-center">集合地点</div><span class="c-left-long c-c">{$vo.addressPoint}</span></div>
            		</div>
            		<div class="exam-content-long">
            			<div><div class="c-left c-t area-center">领队信息</div><span class="c-left-long c-c">{$vo.contact}</span></div>
            		</div>
            		<img src="__IMG__/next.png" class="next-hight" id="{$vo.id}"/>
            	</div>
            	</div>
            	</volist>
			</div>
			
			
		</section>
		
	</body>
	<script type="text/javascript" src="__JS__/filexible_css.js" ></script>
	<script type="text/javascript" src="__JS__/flexible.js" ></script>
	<script>
		mui.init();
		mui("body").on("tap",".back",function(){
			window.history.back();
		});
		
		mui("body").on("tap",".exam-bar",function(){
			
			var id=this.getAttribute("id");
			this.classList.add("active");
			mui("."+id)[0].classList.remove("exam-hidden");
			if(id=="join"){
				mui("#joined")[0].classList.remove("active")
				mui(".joined")[0].classList.add("exam-hidden");
			}else{
				mui("#join")[0].classList.remove("active");
				mui(".join")[0].classList.add("exam-hidden");
			}
		})
		mui(".examList").on("tap",".next",function(){
			var id=this.getAttribute("id");
			window.location.href="{:U('examInfo')}&id="+id;
		})
		mui(".examList").on("tap",".next-hight",function(){
			var id=this.getAttribute("id");
			window.location.href="{:U('examInfoJoin')}&id="+id;
		})
	</script>
	
</html>
